<template>
  <div>
    <el-row>
      <el-col :span="24">
        <div class="alert alert-primary" title="已提交" role="alert">已提交答题
          <el-button type="primary" @click="refresh()">刷新</el-button>
        </div>
      </el-col>
    </el-row>
    <el-row>
      <el-table
        ref="multipleTable"
        :data="getAnswer"
        tooltip-effect="dark"
        style="width: 100%"
        @selection-change="handleSelectionChange"
      >
        <el-table-column type="selection" width="55"></el-table-column>
        <el-table-column label="姓名" prop="name" width="120"></el-table-column>
        <el-table-column prop="info.phonenum" label="电话" width></el-table-column>

        <el-table-column label="测试标题" sortable width>
          <template slot-scope="scope">
            <span v-text="getTeacheritembank.find(v=> v.ID == scope.row.teacheritembankid).name"></span>
          </template>
        </el-table-column>
        <el-table-column label="是否处理" sortable width>
          <template slot-scope="scope">
            <span v-text="scope.row.issee?'已处理':'未处理'"></span>
          </template>
        </el-table-column>
        <el-table-column prop="created_at" label="提交时间" width></el-table-column>
        <el-table-column prop="updated_at" label="标记时间" width></el-table-column>
        <el-table-column label="操作" sortable width>
          <template slot-scope="scope">
            <router-link :to="{ name:'useranswer', params: { ID: scope.row.ID } }">查看</router-link>&nbsp;
            &nbsp;
            &nbsp;
            <el-button
              type="primary"
              size="mini"
              v-if="!scope.row.issee"
              @click="updateanswer(scope.row.ID)"
            >标记已处理</el-button>
          </template>
        </el-table-column>
      </el-table>
    </el-row>
  </div>
</template>

<script>
import { mapGetters } from "vuex";
import { asyncupdateanswer } from "../../../plugins/api.js";
export default {
  name: "answer",
  computed: mapGetters(["getAnswer", "getTeacheritembank"]),
  methods: {
    refresh(){
      this.$store.dispatch("actionAnswer");
    },
    handleSelectionChange() {},
    async updateanswer(ID) {
      this.$confirm("是否标记已处理?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      })
        .then(async () => {

          await asyncupdateanswer({ ID:ID });

          this.$message({
            type: "success",
            message: "成功!"
          });
          this.$store.dispatch("actionAnswer");
        })
        .catch(err => {
          console.log(err);
          this.$message({
            type: "info",
            message: "已取消"
          });
        });
    }
  }
};
</script>
